<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>


<style type="text/css">
@import	url("<c:url value='/resources/css/mantenimiento/productos.css' />");
@import	url("<c:url value='/resources/css/dialogs/columnsStyles2.css' />");
@import	url("<c:url value='/resources/css/jquery.Jcrop.css' />");
</style>

<script type="text/javascript" src="<c:url value='/resources/js/jquery.Jcrop.js' />" ></script>

<div id="pnlNuevo">
	<fieldset>
		<form id="revisarproducto" action="<c:url value='/mantenimiento/guardarProducto' />" method="post" enctype="multipart/form-data" >
			<input type="hidden" id="idProducto" name="id" value="${producto.id}" >
			<div class="pnlDatos">
			<div>
				<p>
					<label><span>Nombre:</span></label> <input name="nombre" type="text" value="${producto.nombre}"   >
				</p>
				<p>
					<label><span>Descripción :</span></label> <input name="descripcion" type="text" value="${producto.descripcion}"   >
				</p>
				<p>
					<label><span>Estados : </span></label>	
					<input type="hidden" id="cboestado"  value="${producto.estadosgenerales.id}"    >	
					<select name="estadosgenerales.id">
						<option value="0">Selecciona uno</option>
						<c:forEach items="${estadosgenerales}" var="e">
							<option value="${e.id}" <c:if test="${producto.estadosgenerales.id == e.id}" > selected="selected" </c:if>  >${e.nombre}</option>
						</c:forEach>
					</select>
				</p>
				<p>
					<label><span>Tipo de Producto:</span></label>	
				<input type="hidden" id="cboestado"  value="${producto.idtipo.id}"    >			
					<select name="idtipo.id"  id="cboTipo" >
						<option value="0">Selecciona uno</option>
						<c:forEach items="${tiposConjuntos}" var="t">						
						<option value="${t.id}"  <c:if test="${ producto.idtipo.id == t.id }" > selected="selected" </c:if> >${t.nombre}</option>
						</c:forEach>
					</select>	
				</p>				
				<p>
					<label><span>Precio por Conjunto:</span></label> <input name="precioConjunto" type="text" value="${producto.precioConjunto}">
				</p>
				<p>
					<label><span>Precio Unitario:</span></label> <input name="precioUnitario" type="text" value="${producto.precioUnitario}">
				</p>
			</div>
			<div>
				<p>
					<label><span>Imagen :</span></label>
					 
				
					 <input id="fileData" value="Seleccione Imagen" type="button"/>
					
										
				</p>	
			<div id="list" style="width: 380px;">
					 <c:if test="${producto.foto != null}">
					 	<img class="thumbImagen" alt="" src="<c:url value='${producto.foto.ruta}/${producto.foto.nombre}' />"  id="cropbox" >
					</c:if>
					 <c:if test="${producto.foto == null}">
					 	<img class="thumbImagen" alt="" src="<c:url value='/resources/images/blanck.png' />"  id="cropbox" >
					</c:if>
			</div>
				 <input type="hidden" id="x" name="x" />
			     <input type="hidden" id="y" name="y" />
			     <input type="hidden" id="w" name="w" />
			     <input type="hidden" id="h" name="h" />
			     <input type="hidden" id="fileRuta" name="fileRuta" value="${producto.foto.ruta}/${producto.foto.nombre}" />
			     <input type="hidden" id="nameImage" name="nameImage" value="${producto.foto.nombre}" />
			     <input type="hidden" id="width" name="width" value="${producto.foto.intWith}" />
			     <input type="hidden" id="height" name="height" value="${producto.foto.intHeight}" />
			     <input type="hidden" id="formato" name="formato" value="${producto.foto.strformato}" />
			</div>			
			</div>	
			<br>
			<br>
            <div>
            <fieldset >
            <legend>Seleccione la sucursal:</legend>
            <div align="center" style="text-align: center;">
            <div style="width: 150px;display: inline-block; padding-right: 5px; text-align: center;">
            
            <div id="sortable1" class='dropfalse'style="width: 150px; height: 100px;  overflow-y:hidden;">
				<c:forEach items="${lstSucursalesAsignados}" var="p">
					<div id="${p.id}" class="ui-state-default" >
						<label > ${p.nombre}  </label>
						<input type="hidden" id="" name="idAsignados" value="${p.id}" />
					</div>
				</c:forEach>
				<div id="" class="" >
				&nbsp;
				</div>
			</div>
			
			
            </div>
            <div style="width: 150px;display: inline-block; padding-left: 5px;">
            
           	<div id="sortable2" class='droptrue' style="width: 150px; height: 100px; overflow-y:hidden;">
				<c:forEach items="${lstSucursalesDisponibles}" var="p">
					<div id="${p.id}" class="ui-state-default" >
						<label > ${p.nombre}  </label>
						<input type="hidden" id="" name="idDisponibles" value="${p.id}" />
					</div>
				</c:forEach>
				<div id="" class="" >
				&nbsp;
				</div>
			</div>
			
			
            </div>
            </div>
            </fieldset>            
            </div>
			<br>		
			<p align="center">
				<a href="#" class="guardar">Guardar</a>
			</p>
		</form>
	</fieldset>
</div>